import { defineStore } from 'pinia'
import type { ThemeState, ThemeType } from '@/stores/modules/types/themeState'
import { type DerivativeFunc, theme } from 'ant-design-vue'
import type { AliasToken, MapToken, SeedToken } from 'ant-design-vue/es/theme/interface'
import { store } from '@/stores'
import type { ComputedRef } from 'vue'

export const useThemeStore = defineStore({
  id: 'simple-theme',
  state: (): ThemeState => ({
    themeType: 'default'
  }),
  actions: {
    /**
     * 获取主题Token
     */
    getThemeToken(): ComputedRef<AliasToken> {
      return theme.useToken().token
    },
    /**
     * 设置主题Token
     * @param themeType 主题类型
     */
    setThemeToken(themeType: ThemeType) {
      this.themeType = themeType
    },
    /**
     * 根据主题类型获取主题算法
     */
    getByTypeTheme(type: ThemeType): DerivativeFunc<SeedToken, MapToken> {
      const themeMap = {
        default: theme.defaultAlgorithm,
        dark: theme.darkAlgorithm,
        compact: theme.compactAlgorithm
      }
      return themeMap[type]
    }
  },
  persist: {
    key: 'simple-theme',
    storage: localStorage
  }
})

/**
 * 获取主题Token
 */
export function getThemeTokenHook(): ComputedRef<AliasToken> {
  return useThemeStore(store).getThemeToken()
}

export function useThemeStoreHook() {
  return useThemeStore(store)
}
